<?php
/**
 * Created by PhpStorm.
 * User: luanalex
 * Date: 2017/9/18
 * Time: 11:31
 */

?>

<!DOCTYPE html>
<html>
<style>
    ul
    {
        display: block;
        list-style-type:none;
        margin:0;
        padding:0;
        padding-top:6px;
        padding-bottom:6px;
    }
    li
    {
        display:inline;
    }
    a:link,a:visited
    {
        font-weight:bold;
        color:#FFFFFF;
        background-color:#98bf21;
        text-align:center;
        padding:6px;
        text-decoration:none;
        text-transform:uppercase;
    }
    a:hover,a:active
    {
        background-color:#7A991A;
    }

    /*a*/
    /*{*/
        /*display:block;*/
        /*width:60px;*/
        /*background-color:#dddddd;*/
    /*}*/
</style>

<head>
    </head>

<body>

<ul>
    <li><a href="#home">Home</a></li>
    <li><a href="#news">News</a></li>
    <li><a href="#contact">Contact</a></li>
    <li><a href="#about">About</a></li>
</ul>
<div style="display: block;">
    <div style="display: inline;">this is div;</div>
    <div>滚滚滚</div>
    <div style="display: inline;">this is div;</div><div style="display: inline;">this is div;</div>

</div>

<p><b>注释：</b>我们使用在测试链接中使用了 href="#"。在真实的网站中，应该是真实的 URL。</p>

</body>
</html>